<template>
  <div class="common-layout min-h-screen">
    <el-header class="!p-0">
      <BackHead></BackHead>
    </el-header>
    <el-container class="w-1200 m-auto mt-5">
      <el-container class="gap-5">
        <el-aside class="h-180 sticky top-0" width="auto">
          <CustomSidebar :menuItems="menus"></CustomSidebar>
        </el-aside>
        <el-main class="bg-white">
          <router-view v-slot="{ Component, route }">
            <transition name="fade-transform" mode="out-in">
              <component :is="Component" :key="route.path" />
            </transition>
          </router-view>
        </el-main>
      </el-container>
    </el-container>
    <el-footer class="!p-0 mt-10">
      <div class="flex justify-center items-center h-40 bg-#4D5772 ">
        <div>

          <a href="https://beian.miit.gov.cn/" class="!color-white" target="_blank">冀ICP备2023032117号-1</a>
        </div>
      </div>
    </el-footer>
  </div>
  <div>


  </div>
</template>
<script setup lang="ts">
import BackHead from './backHead.vue';

// 根据路由获取菜单参数，初始化菜单
const { matched } = useRoute()
const menus = matched[0]['children'].filter(f => !!f.meta)
onMounted(() => {
  console.log(matched);
})
defineOptions({
  name: "backIndex"
})
</script>
